﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Truyendanghe.ascx.cs"
    Inherits="Framework.Portal.Layouts.Client.Components.Teenio.Truyendanghe" %>
<div class="col2">
    <div class="detail_event">
        <h1 class="cate_title_event">
            <%= MENUNAME %></h1>
        <asp:Repeater ID="rptContent" runat="server" OnItemDataBound="rptContent_ItemDataBound">
            <ItemTemplate>
                <div class="left_sapo">
                    <asp:Image ID="imgAvatar" BorderWidth="1" Width="110" Height="90" runat="server" ImageUrl="/Uploads/117/1/PreAvatar/ava3.jpg" />
                </div>
                <!--end:left_sapo -->
                <div class="right_sapo">
                    <h2 class="title_details">
                        <asp:HyperLink ID="hplTitle" runat="server" CssClass="title_a"></asp:HyperLink></h2>                   
                    <p>
                        <asp:Literal ID="lblTeaser" runat="server"></asp:Literal>
                    </p>
                </div>
                <!--end:right_sapo -->
                <br class="clear" />
                <small class="time com_like">
                    <asp:Literal ID="lblCreateDate" runat="server"></asp:Literal>
                    <span id="boxLike_<%# Eval("CONTENT_ID") %>"><a style="margin: 0 0 0 10px" href="javascript:;" onclick="DoVote(<%# Eval("CONTENT_ID") %>);">Thích</a></span>
                    <span id="boxView_<%# Eval("CONTENT_ID") %>"></span></small>
                <ul class="cmmt1" id="boxComment_<%# Eval("CONTENT_ID") %>">
                    <li id="write_<%# Eval("CONTENT_ID") %>_0">
                        <div id="inputCMTHidden_<%# Eval("CONTENT_ID") %>" style="width: 100%; float: left;" onclick="ShowCommentBox(<%# Eval("CONTENT_ID") %>);">
                            <input name="" id="txttempRawContent_<%# Eval("CONTENT_ID") %>" type="text" value="Viết bình luận" />
                        </div>
                        <div id="inputCMT_<%# Eval("CONTENT_ID") %>" style="width: 100%; float: left;" onclick="HideCommentBox(<%# Eval("CONTENT_ID") %>);">
                            <textarea id="txtRawContent_<%# Eval("CONTENT_ID") %>" rows="5" cols="150" style="width: 100%;"></textarea>
                            <br />
                            <a class="button fr" onclick="SendComent(<%# Eval("CONTENT_ID") %>);" href="javascript:;"><span>Bình luận</span></a>
                        </div>
                    </li>
                </ul>
                <br class="clear" />
            </ItemTemplate>
            <AlternatingItemTemplate>
                <div class="left_sapo">
                    <asp:Image ID="imgAvatar" BorderWidth="1" Width="110" Height="90" runat="server" ImageUrl="/Uploads/117/1/PreAvatar/ava3.jpg" />
                </div>
                <!--end:left_sapo -->
                <div class="right_sapo">
                    <h2 class="title_details">
                        <asp:HyperLink ID="hplTitle" runat="server" CssClass="title_a"></asp:HyperLink></h2>                   
                        <asp:Literal ID="lblTeaser" runat="server"></asp:Literal>
                    </p>
                </div>
                <!--end:right_sapo -->
                <br class="clear" />
                <small class="time com_like">
                    <asp:Literal ID="lblCreateDate" runat="server"></asp:Literal>
                    <span id="boxLike_<%# Eval("CONTENT_ID") %>"><a style="margin: 0 0 0 10px" href="javascript:;" onclick="DoVote(<%# Eval("CONTENT_ID") %>);">Thích</a></span>
                    <span id="boxView_<%# Eval("CONTENT_ID") %>"></span></small>
                <ul class="cmmt1" id="boxComment_<%# Eval("CONTENT_ID") %>">
                    <li id="write_<%# Eval("CONTENT_ID") %>_0">
                        <div id="inputCMTHidden_<%# Eval("CONTENT_ID") %>" style="width: 100%; float: left;" onclick="ShowCommentBox(<%# Eval("CONTENT_ID") %>);">
                            <input name="" id="txttempRawContent_<%# Eval("CONTENT_ID") %>" type="text" value="Viết bình luận" />
                        </div>
                        <div id="inputCMT_<%# Eval("CONTENT_ID") %>" style="width: 100%; float: left;" onclick="HideCommentBox(<%# Eval("CONTENT_ID") %>);">
                            <textarea id="txtRawContent_<%# Eval("CONTENT_ID") %>" rows="5" cols="150" style="width: 100%;"></textarea>
                            <br />
                            <a class="button fr" onclick="SendComent(<%# Eval("CONTENT_ID") %>);" href="javascript:;"><span>Bình luận</span></a>
                        </div>
                    </li>
                </ul>
                <br class="clear" />
            </AlternatingItemTemplate>
        </asp:Repeater>
        <asp:Literal ID="lblPaging" runat="server"></asp:Literal>
        <br class="clear" />
    </div>
</div>
<!--************* end:col2 *************-->
<script type="text/javascript">
    var curentUser = <%= currentUserId %>;
    var arrayArticle = <%= arrayArticle %>;
    $(document).ready(function () {
        var initEditor = function (articleId) {
            $("#txtRawContent_" + articleId).sceditorBBCodePlugin({
                toolbar: "bold,italic,underline,|,emoticon",
                style: "/ClientScript/sceditor/css/jquery.sceditor.default.min.css"
            });
        };
         $.each(arrayArticle, function(index, value) { 
            initEditor(value);
            $("#inputCMT_" + value).hide();
            $("#inputCMTHidden_" + value).show();            
            GetContribution(value);
            $.ajax({
                type: "POST",
                cache: false,
                url: "Resources.ashx?module=contribution&action=getview",
                data: { "articleId": value},
                success: function (html) {
                    $("#boxView_" + value).html("<span class=\"dot\">·</span> " + html + " lượt nghe");
                },
                timeout: 5000,
                complete: function () {  

                 }
            });
        });        
    });
    function ShowCommentBox(articleID) {
        $("#inputCMT_" + articleID).show();
        $("#inputCMTHidden_" + articleID).hide();
        //txttempRawContent
        $("#txtRawContent_" + articleID).data("sceditor").focus();
    }
    function HideCommentBox(articleID) {
        if ($("#txtRawContent_" + articleID).data("sceditor").val().length <= 0) {
            $("#inputCMT_" + articleID).hide();
            $("#inputCMTHidden_" + articleID).show();
        }
    }
    function SendComent(articleID) {        
        var commentReturn;
        $.ajax({
            type: "POST",
            cache: false,
            url: "Resources.ashx?module=contribution&action=insertcomment",
            data: { "articleId": articleID, "message": $("#txtRawContent_" + articleID).data("sceditor").val()},
            success: function (html) {
                commentReturn = html;
            },
            timeout: 5000,
            complete: function () {                
                var html = '<a href="http://my.go.vn/?id=' + commentReturn.Data.USERID +'"><img src="' + getAvatarUrl(commentReturn.Data.USERID, 36) + '" /></a>';
                html += '<p>';
                html += '<a href="http://my.go.vn/?id=' + commentReturn.Data.USERID +'" class="name">' + commentReturn.Data.USERNAME + ' </a><span>';
                html += commentReturn.Data.MESSAGE;
                html += '</span><br /><span class="date">' + formatDateTime(commentReturn.Data.DATETIME) + '</span> ';
                html += '<span class="set"><a href="#" class="err">&nbsp;</a><a href="#" class="del">&nbsp;</a></span>'
                html += '</p>'; 
                var dataresponse = jQuery.data(document.body, 'dataresponse_' + articleID);
                dataresponse.Comments[dataresponse.Comments.length] = commentReturn.Data;
                $("#boxComment_" + articleID).append($('<li>').attr('id', 'cmt_' + dataresponse.Comments.length).append(html));              
            }
        });
        $("#txtRawContent_" + articleID).data("sceditor").val("");
        HideCommentBox(articleID);
    }
    function DoVote(articleID) {         
        var likeReturn;
        $.ajax({
            type: "POST",
            cache: false,
            url: "Resources.ashx?module=contribution&action=insertvote",
            data: { "articleId": articleID},
            success: function (html) {
                likeReturn = html;
            },
            timeout: 5000,
            complete: function () {                
                $("#boxLike_" + articleID).html("<span class=\"csslikeCommentl1\">Bạn đã thích nội dung này</div>");
            }
        });
        $("#txtRawContent_" + articleID).data("sceditor").val("");
        HideCommentBox(articleID);
    }
    
    function GetContribution(articleID) {        
        $.ajax({
            type: "POST",
            cache: false,
            url: "Resources.ashx?module=contribution&action=getcontribution",
            data: { "articleId": articleID},
            success: function (html) {
                jQuery.data(document.body, 'dataresponse_' + articleID, html);
            },
            timeout: 5000,
            complete: function () {    
                var dataresponse = jQuery.data(document.body, 'dataresponse_' + articleID); 
                //var arrContri = eval("[" + dataresponse + "]");
                if(dataresponse.Comments.length > 5){
                    $("#boxComment_" + articleID).append($('<li>').attr('id', 'iter_' + articleID + '_0').append($('<a>').attr('href', 'javascript:;').attr('onclick', 'GetAllComment(' + articleID + ');').html("Xem tất cả " + dataresponse.Comments.length + " bình luận")));
                }
                if(dataresponse.Likes.length > 0){
                    var isMe = -1;
                    $.each(dataresponse.Likes, function(index, value) { 
                        if(value.USERID == curentUser){
                            isMe = index;
                        }
                    });
                    if(dataresponse.Likes.length > 2){
                        if(isMe >= 0){
                            $("#boxLike_" + articleID).hide();
                            $("#boxComment_" + articleID).append($('<li>').attr('id', 'cmt_' + articleID + '_0').append("<a href=\"http://my.go.vn/?id=" + curentUser + "\">Bạn</a> và <a href=\"javascript:;\" onclick=\"GetAllLike()\">" + (dataresponse.Likes.length - 1) + " người</a> đã thích nội dung này"));
                        }
                        else{
                            $("#boxComment_" + articleID).append($('<li>').attr('id', 'cmt_' + articleID + '_0').append("<a href=\"http://my.go.vn/?id=" + dataresponse.Likes[0].USERID +"\">" + dataresponse.Likes[0].USERNAME + "</a>, <a href=\"http://my.go.vn/?id=" + dataresponse.Likes[1].USERID +"\">" + dataresponse.Likes[1].USERNAME + "</a> và <a href=\"javascript:;\" onclick=\"GetAllLike()\">" + (dataresponse.Likes.length - 2) + " người</a> đã thích nội dung này"));
                        }
                    }
                    else{
                        if(isMe >= 0)
                            $("#boxLike_" + articleID).hide();
                        var html = '';
                        $.each(dataresponse.Likes, function(index, value) { 
                            if(index == 0)
                                html += "<a href=\"http://my.go.vn/?id=" + value.USERID +"\">" + value.USERNAME + "</a>";
                            else
                                html += ", <a href=\"http://my.go.vn/?id=" + value.USERID +"\">" + value.USERNAME + "</a>";
                        });
                        $("#boxComment_" + articleID).append($('<li>').attr('id', 'cmt_" + articleID + "_0').append(html + " đã thích nội dung này"));
                    }
                }
                var index = dataresponse.Comments.length - 4;
                if(index < 0)
                    index = 0;
                for(var i = index; i < dataresponse.Comments.length; i++)
                {
                    var html = '<a href="http://my.go.vn/?id=' + dataresponse.Comments[i].USERID +'"><img src="' + getAvatarUrl(dataresponse.Comments[i].USERID, 36) + '" /></a>';
                    html += '<p>';
                    html += '<a href="http://my.go.vn/?id=' + dataresponse.Comments[i].USERID +'" class="name">' + dataresponse.Comments[i].USERNAME + ' </a><span>';
                    html += dataresponse.Comments[i].MESSAGE;
                    html += '</span><br /><span class="date">' + formatDateTime(dataresponse.Comments[i].DATETIME) + '</span> ';
                    html += '<span class="set"><a href="#" class="err">&nbsp;</a><a href="#" class="del">&nbsp;</a></span>'
                    html += '</p>';
                    $("#boxComment_" + articleID).append($('<li>').attr('id', 'cmt_' + articleID + '_' + (i + 1)).append(html));
                }
            }
        });
    }
    function GetAllLike(articleID){
        var dataresponse = jQuery.data(document.body, 'dataresponse_' + articleID);
        var html = '';
        $.each(dataresponse.Likes, function(index, value) { 
            if(index == 0)
                html += "<a href=\"http://my.go.vn/?id=" + value.USERID +"\">" + value.USERNAME + "</a>";
            else
                html += ", <a href=\"http://my.go.vn/?id=" + value.USERID +"\">" + value.USERNAME + "</a>";
        });
        $("#cmt_" + articleID + "_0").html(html + " đã thích nội dung này");
    }
    function GetAllComment(articleID){
        var dataresponse = jQuery.data(document.body, 'dataresponse_' + articleID);
        for(var i = 0; i < dataresponse.Comments.length - 4; i++)
        {
            var html = '<a href="http://my.go.vn/?id=' + dataresponse.Comments[i].USERID +'"><img src="' + getAvatarUrl(dataresponse.Comments[i].USERID, 36) + '" /></a>';
            html += '<p>';
            html += '<a href="http://my.go.vn/?id=' + dataresponse.Comments[i].USERID +'" class="name">' + dataresponse.Comments[i].USERNAME + ' </a><span>';
            html += dataresponse.Comments[i].MESSAGE;
            html += '</span><br /><span class="date">' + formatDateTime(dataresponse.Comments[i].DATETIME) + '</span> ';
            html += '<span class="set"><a href="#" class="err">&nbsp;</a><a href="#" class="del">&nbsp;</a></span>'
            html += '</p>';
            $("#cmt_" + articleID + "_" + (dataresponse.Comments.length - 3)).before($('<li>').attr('id', 'cmt_' + articleID + '_' + (i + 1)).append(html));
        }
        $("#iter_" + articleID + "_0").hide();
    }
    function getAvatarUrl(accountId, option) {
	    var width = 50;
	    var height = 50;
	    if (option == 1) { width = 16; height = 16; }
	    else if (option == 2) { width = 50; height = 50; }
	    else if (option == 3) { width = 200; height = 200; }
	    else if (option == 4) { width = 32; height = 32; }
	    else if (option == 36) { width = 36; height = 36; }
	    return "http://avatar.go.vn/avatar/store/account/" + parseInt(accountId / 1000000) + "/" + parseInt(accountId / 1000) + "/" + accountId + "/" + accountId + ".png." + width + "." + height + ".cache"
    }
    function fill2(value) {
            return value < 10 ? ('0' + value) : value;
    }
    function formatDateTime(a) {
            
        var e = [[11, 'sáng'], [14, 'trưa'], [19, 'chiều']];
        var f = ['Chủ Nhật', 'Thứ Hai', 'Thứ Ba', 'Thứ Tư', 'Thứ Năm', 'Thứ Sáu', 'Thứ Bảy'];
        var g = AppEnv.datetime; //new Date();
        var j = new Date(a);
        var d = Math.floor(g.getTime() / 1000) - Math.floor(a / 1000) + 15;
        //alert(d);
        if (d < 0) {
            return j.getHours() + ':' + fill2(j.getMinutes()) + ' ' + fill2(j.getDate()) + '/' + fill2(j.getMonth() + 1) + '/' + j.getFullYear();
        }
        if (d < 60) {
            return (d == 0 ? 'vài' : d) + ' giây trước';
        }

        if (d < 3600) return Math.floor(d / 60) + ' phút trước';
        if (d < 43200) return Math.floor(d / 3600) + ' tiếng trước';
        var h = j.getHours();
        var m = fill2(j.getMinutes());
        if (d < 518400) {
            var b = 'tối';
            for (i = 0; i < 3; i++) if (h < e[i][0]) {
                b = e[i][1];
                break
            }
            d = (g.getDay() + 7 - j.getDay()) % 7;
            var k = '';
            if (d == 0)
                k = 'hôm nay';
            else {
                return h + ':' + m + ' ' + fill2(j.getDate()) + '/' + fill2(j.getMonth() + 1) + '/' + j.getFullYear(); //f[j.getDay()];
            }
            return (h % 12).toString() + ':' + m + ' ' + b + ' ' + k
        }
        h = fill2(h);
        return h + ':' + m + ' ' + fill2(j.getDate()) + '/' +
		fill2(j.getMonth() + 1) + '/' + j.getFullYear();
    }
</script>
